<template>
	<view class="checkout">
		<view class="address">
			<view class="person">
				<view class="name">收货人：<text>{{order.address_name}}</text></view>
				<view class="phone">{{order.address_phone}}</view>
			</view>
			<view class="detail" v-show="order.shipping_method=='package'">
				收货地址：<text>{{order.address_province}}{{order.address_city}}{{order.address_area}}{{order.address_detail}}</text>
			</view>
			<!--        <view class="edit"></view>-->
		</view>

		<view class="product-list">

			<block v-for="item,index in order.goods" >
				<view class="item">
					<view class="img">
						<image mode="widthFix" v-bind:src="item.image"></image>
					</view>
					<view class="info">
						<view class="name">{{item.goods_name}}</view>
						<view class="product-option">{{item.goods_option}}</view>
						<view class="price-number">
							<view class="price">￥{{item.goods_price}}</view>
							<view class="number">{{item.goods_num}}</view>
						</view>
					</view>
				</view>
			</block>

		</view>
		<view class="key-value shipping">
			<view class="key">配送方式</view>
			<view class="value">{{order.shipping_method_text}}</view>
		</view>
		<view
		 v-bind:class="{'hide':order.shipping_method!='pickup'}"
		 class="key-value pickup ">
			<view class="key">自提门店：</view>
			<view v-if="order.pickup" class="value">{{order.pickup.pickup_name}}</view>
		</view>
		<view 
		v-bind:class="{'hide':order.shipping_method!='pickup'}"
		class="key-value pickup ">
			<view class="key">自提门店电话：</view>
			<view v-if="order.pickup" class="value">{{order.pickup.pickup_phone}}</view>
		</view>

		<block v-if="order.package.length">
			<view class="key-value package" v-for="item,index in order.package" >
				<view class="key">{{item.name}}</view>
				<view class="value">快递单号：{{item.package_no}}</view>
			</view>
		</block>


		<view class="key-value note">
			<view class="key">买家留言</view>
			<input readonly="readonly" class="value" v-model="order.message" type="text" />
		</view>
		<view class="key-value product-total">
			<view class="key">商品金额</view>
			<view class="value">￥{{order_total.goods}}</view>
		</view>
		<view class="key-value shipping-total">
			<view class="key">运费</view>
			<view class="value">￥{{order_total.shipping}}</view>
		</view>
		<view class="key-value total-total">
			<view class="key"></view>
			<view class="value">合计：<text class="red">￥{{order_total.total}}</text></view>
		</view>


		<view class="order-panel">
			<view class="total">
				合计：<text class="red">￥{{order_total.total}}</text>
			</view>
			<view v-show="order.is_payed!=1"  @tap="gotoBuy(order)" class="btn btn-order">去支付</view>
		</view>

	</view>
</template>

<script>
	var appInstance = getApp();
	export default {
		data() {
			return {
				order_id: '',
				order: {

				},
				order_total: {
					shipping: 0,
					goods: 0,
					total: 0,
				}
			}
		},
		onLoad: function(options) {

			this.order_id = options.order_id;
			this.order_info();

		},
		onPullDownRefresh: function() {
		
			var p = new Promise(this.order_info);
			p.then(function(result) {
				uni.stopPullDownRefresh();
			});
		},
		methods: {
			order_info: function() {

				var t = this;
				var url = '&r=checkout.order.info';
				var data = {
					order_id: this.order_id,
				};

				appInstance.globalData.request(url, data, "GET", res => {

					// console.log(res.data);
					if (!res.data.status) {

						res.data.order.total.forEach(function(item) {

							if (item.code == 'shipping') {
								t.order_total.shipping = item.value;
							}
							if (item.code == 'goods') {
								t.order_total.goods = item.value;
							}
							if (item.code == 'total') {
								t.order_total.total = item.value;
							}

						});
						t.order = res.data.order;
					}

				});


			},

			gotoBuy: function(  order ) {

				var url = '&r=checkout.xpay.index_xcx';

				var data = {
					order_id: order.id,
				};

				var t = this;
				appInstance.globalData.request(url, data, 'GET', res => {

					if (res.data.nonceStr) {
						uni.requestPayment({
							timeStamp: res.data.timeStamp,
							nonceStr: res.data.nonceStr,
							package: res.data.package,
							signType: res.data.signType,
							paySign: res.data.paySign,
							success(res) {

								t.pay_notify();
							},
							fail(res) {

							}
						});

					}else if( res.data.status ){
						uni.showToast({
						  title: res.data.description,
						  icon: 'none',
						  duration: 1200
						});
					}


				});

			},

			pay_notify: function(order) {

				var t = this;
				var url = '&r=checkout.xpay.pay_notify';
				var data = {
					'order_id': order.id
				};
				appInstance.globalData.request(url, data, 'POST', function() {

					t.order_info();

				});

			},
		}
	}
</script>

<style lang="less">
	@import './single.less';
</style>
